<template>
	<div class="conbox" v-wechat-title="headtitle">
		<div class="inter_top">积分明细</div>
		<div class="cashlist">
			<ul class="centerul">
				<li v-for="(item,index) in listcount" :key="index">
					<div class="lifirst">
						<p class="reson">{{item.change_desc}}</p>
						<!-- <p class="recharge">{{item.change_type}}</p>-->
						<p class="time_show">{{item.change_time}}</p>
					</div>
					<!-- <div class="lisecond reson">{{item.user_money}}</div>-->
					<div class="lisecond reson">{{item.type}}{{item.pay_points}}</div>
				</li>
				<uniLoadMore  :status="loading"></uniLoadMore>
			</ul>
		</div>
	</div>
</template>

<script>
import { getintergral } from '@/api/payment'
import uniLoadMore from '@/components/uLi-load-more/uLi-load-more'
export default {
	name: 'interalDetail',
	components: {
		uniLoadMore
	},
	data() {
		return {
			headtitle: '积分明细',
			page: 1,
			listcount: [],
			owner_user_id: '',
			timer: null,
			loadingText: '加载中...',
			loadingType: 0, // 定义加载方式 0---contentdown  1---contentrefresh 2---contentnomore
			loading: ''
		}
	},
	onLoad(opcation) {
		this.owner_user_id = opcation.owner_user_id
		this.getinterlist()
		uni.showLoading({
			title: '数据加载中'
		})
	},
	onPullDownRefresh() {
		this.loading = ''
		this.getinterlist()
		uni.showLoading({
			title: '数据刷新中'
		})
	},
	onReachBottom: function() {
		var that = this
		if (that.timer != null) {
			clearTimeout(that.timer)
		}
		this.timer = setTimeout(function() {
			that.getpushmore()
		}, 1000)
		// this.getcasemore();
	},
	mounted() {
	},
	methods: {
		// 初始化加载
		getinterlist() {
			this.page = 1
			this.loadingType = 0
			uni.showNavigationBarLoading()
			let data = {
				limit: 8,
				page: this.page
			}
			getintergral(data).then(res => {
				if (res.status == 'success') {
					if (res.data.data.length > 0) {
						var lists = res.data.data
						this.listcount = lists
						uni.hideNavigationBarLoading()
						uni.stopPullDownRefresh()
					} else {
						this.msg(res.message)
						this.loading = 'nodata'
					}
				} else {
					this.msg(res.message)
					this.loading = 'nodata'
				}
				this.hideloading()
			})
		},
		msg(msg) {
			uni.showToast({
				title: msg,
				icon: 'none'
			})
		},
		// 加载更多
		getpushmore() {
			this.page++
			if (this.loadingType !== 0) { // loadingType!=0;直接返回
				return false
			}
			this.loadingType = 1
			uni.showNavigationBarLoading()
			uni.showLoading({
				title: '数据加载中'
			})
			let data = {
				limit: 8,
				page: this.page
			}
			getintergral(data).then(res => {
				if (res.status == 'success') {
					if (res.data.data.length > 0) {
						var lists = res.data.data
						this.listcount = this.listcount.concat(lists)
						this.loadingType = 0// 将loadingType归0重置
					}
					if (res.data.current_page == res.data.last_page) {
						this.loading = 'nomore'
					}
				} else {
					uni.showToast({
						title: res.message,
						icon: 'none'
					})
					this.loading = 'nodata'
				}
				this.hideloading()
				uni.hideNavigationBarLoading()
			})
		},
		hideloading() {
			setTimeout(function() {
				uni.hideLoading()
			}, 500)
		}
	}
}
</script>

<style scoped>
	header {
		background: #F5F5F5;
		line-height: 90px;
		font-size: 24px;
		text-align: left;
	}
	header ul{
		width: 100%;
		height: 100%;
		float: left;
	}
	header ul li{
		float: left;
		color: #999999;
	}
	header ul .lifirst{
		text-indent: 30px;
	}
	.inter_top{
		color: #999999;
		height: 90px;
		text-indent: 29px;
		line-height: 100px;
		background: #eeeeee;
	}
	.lifirst{
		float: left;
		width: 75%;
		font-size: 24px;
	}
	.lisecond{
		float: right;
		width: 25%;
		text-align: right;
		line-height: 127px;
	}
	.cashlist{
		width: 100%;
		height: auto;
		background: white;
	/*	top: 90px;*/
		float: left;
		position: relative;
	}
	.cashlist ul{
		width: 100%;
		height: auto;
		display: block;
	}
	.cashlist ul li{
		height: 127px;
		width: 91%;
		/*float: left;*/
		padding: 15px 0;
		margin-left: 29px;
		border-bottom: 1px solid #eeeeee;
	}
	.cashlist ul li:last-child{
		border: none;
	}
	.reson{
		font-size: 30px;
	}
	.lifirst .reson{
		margin-top: 30px;
		/*margin-bottom: 19px;*/
		text-overflow: -o-ellipsis-lastline;
		overflow: hidden;
		text-overflow: ellipsis;
		/*! autoprefixer: off */
		display: -webkit-box;
		/* autoprefixer: on */
		-webkit-line-clamp: 1;
		line-clamp: 1;
		/*! autoprefixer: off */
		-webkit-box-orient: vertical;
		/* autoprefixer: on */
		word-break: break-all;
	}
	.time_show{
		color: #999999;
		margin-top: 10px;
	}
	.recharge{
		margin-top: 20px;
	}
	.lifirst p:nth-child(3){
		color:#999999;
		margin-top: 10px;
	}
</style>
